﻿@{
    ViewBag.Title = "登录";
    Layout = "~/Views/DefaultLayout.cshtml";
}
<script src="~/js/common.js"></script>
<script type="text/javascript">
    var refreshValidCode = function () {
        $("#imgValidCode").attr("src", "/User/ValidCode?ts=" + new Date());
    }
    var loginSuccess = function (data) {
        if (data.isOK) {
            window.location.href = data.nextUrl;
        }
        else {
            refreshValidCode();
            alert(data.msg);
        }
    }
    var loginError = function () {
        alert("登陆请求处理失败");
    }
    $(function () {
        $("#btnLogin").click(function () {
            if (!checkRequired("userName", "用户名") || !checkRequired("password", "密码")
                 || !checkRequired("validCode", "验证码")) {
                return;
            }
            var userName = $("#userName").val();
            var password = $("#password").val();
            var validCode = $("#validCode").val();
            $.ajax({
                type: "POST", dataType: "json", url: "/User/Login",
                data: { userName: userName, password: password,validCode:validCode },
                success: loginSuccess, error: loginError
            });
        });
        $("#imgValidCode").click(refreshValidCode);
    });
</script>
<style type="text/css">
    .loginForm tr,.loginForm input,.loginForm img {
        height:30px;
        vertical-align:central
    }
    #btnLogin {
        width:100px;
    }
</style>
<table class="loginForm">
    <tr><td>用户名</td><td><input type="text" id="userName" /></td></tr>
    <tr><td>密 码 </td><td><input type="password" id="password" /></td></tr>
    <tr><td>验证码</td><td><input type="text" id="validCode" /></td></tr>
    <tr><td></td><td><img src="/User/ValidCode" id="imgValidCode" /></td></tr>
    <tr><td colspan="2"><input type="button" id="btnLogin" value="登录"/></td></tr>
</table>